import 'package:erp/Collections/Collection.dart';
import 'package:erp/Entity/Product.dart';
import 'package:erp/EventBus/EventBus.dart';
import 'package:erp/Events/EventAddrs.dart';
import 'package:erp/Store/ProductStore.dart';
import 'package:erp/UI/Components/EventfulState.dart';
import 'package:erp/UI/Pages/BasicInformationManagementPages/ProductManagementPages/AddProductPage.dart';
import 'package:erp/global.dart';
import 'package:flutter/material.dart';

class ProductViewer extends StatelessWidget {
  bool isSelectionMode;

  ProductViewer({this.isSelectionMode = false});

  @override
  Widget build(BuildContext context) => ProductViewerStateful(this);
}

class ProductViewerStateful extends StatefulWidget {
  ProductViewer params;

  ProductViewerStateful(this.params);

  @override
  State<StatefulWidget> createState() => ProductViewerState(params);
}

class ProductViewerState extends EventfulState<ProductViewerStateful> {
  ProductViewer params;
  var itemWidth = 150.0;
  var itemHeight = 170.0;
  var itemPadding = 10.0;

  ProductViewerState(this.params);

  @override
  void initState() {
    super.initState();

    eventIds = [
      bus.subscribe(Events.PRODUCT_DATA_SELECT_SUCCESS, (bus, data){setState(() {});}),
      bus.subscribe(Events.PRODUCT_DATA_UPDATE_SUCCESS, (bus, data){setState(() {});}),
      bus.subscribe(Events.PRODUCT_DATA_DELETE_SUCCESS, (bus, data){setState(() {});}),
    ];
  }

  @override
  Widget build(BuildContext context) {
    var rows = <Widget>[];
    Map<String, List<Product>> productGroup = Collection.groupSimpleObjects(
        ProductStore.products, (item) => item.typeName);
    productGroup.forEach((category, product) {
      rows.add(Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(15.0),
            color: Colors.white,
          ),
          margin: EdgeInsets.only(bottom: 20.0, top: 20.0, right: 10.0, left: 10.0),
          height: itemHeight,
          child: Stack(
            children: <Widget>[
              Column(
                children: <Widget>[
                  SizedBox(
                    height: 5.0,
                  ),
                  Expanded(
                    child: ListView(
                      scrollDirection: Axis.horizontal,
                      children: product.map((item) => buildItem(context, item)).toList(),
                    ),
                  ),
                ],
              ),
              Align(
                alignment: Alignment(0.0, -1.3),
//              child: Text(category),
                child: Container(
                    height: 35.0,
                    width: 150.0,
//              color: Colors.blue,
                    padding: EdgeInsets.zero,
                    child: Card(
                      margin: EdgeInsets.only(),
                      child: Center(
                        child: Text(category ?? ""),
                      ),
                    )),
              )
            ],
          )));
    });

    return Column(
      children: rows,
    );
  }

  Widget buildItem(BuildContext context, Product data) {
    return GestureDetector(
      onTap: () {
        if (params.isSelectionMode) {
          Navigator.of(context).pop(data);
        } else {
          Navigator.of(context).push(MaterialPageRoute(builder: (context) => AddProductPage(data, OperationMode.DETAIL, heroName: data.id.toString(),)));
        }
      },
      child: Container(
        width: itemWidth,
        height: itemHeight,
//      padding: EdgeInsets.only(top: 10.0),
        margin: EdgeInsets.all(itemPadding),
        child: Card(
          child: Column(
            children: <Widget>[
              SizedBox(
                height: 5.0,
              ),
              Expanded(
                flex: 1,
                child: Hero(
                  tag: data.id.toString(),
                  child: Image.network(data.imgurl),
                ),
              ),
              Container(
                margin: EdgeInsets.all(5.0),
                child: Text(
                  data.nameUg ?? data.nameZh ?? "",
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}


